.parallax {
  /* The image used */
  background-image: url("../img/main-headerimg.jpg");

  /* Set a specific height */
  min-height: 600px;
  position: relative;
  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.caption {
  position: absolute;
  left: 5%;
  top: 40%;
  width: 90%;
  text-align: center;
  color: #FFF;
  font-size: 3.5em;
  font-weight: 900;
}
.caption br{ display:inline;}

.smallerparallax {
  background-image: url("../img/small-headerimg.jpg");
  min-height: 250px;
  background-attachment:inherit;

}
.smallerparallax  > .caption {
  top: 50%;
}

@media (min-width: 1366px) {

}

/* Portrait tablet to landscape and desktop */
@media (min-width: 1024px) and (max-width: 1365px) {
	.caption { font-size: 3.5em; }
	.caption br{ display:inline-block;}
}

@media (min-width: 721px) and (max-width: 1023px) {
	.caption { font-size: 3em; }
	.caption br{ display:inline-block;}
}

@media (min-width: 768px) and (max-width: 1023px) {
	.parallax { min-height: 450px; }
	.smallerparallax { min-height: 250px }
	.caption { font-size: 2.5em; }
	.caption br{ display:inline-block;}
}

@media (min-width: 535px) and (max-width: 767px) {
	.parallax { min-height: 300px }
	.smallerparallax { min-height: 200px }
	.caption { font-size: 2.33em; }
	.caption br{ display:none;}
}

@media (min-width:390px) and (max-width: 534px) {
	.parallax { min-height: 300px }
	.smallerparallax { min-height: 200px }
	.caption { font-size: 2.3em; }
	.caption br{ display:none;}
}

@media (min-width:0px) and (max-width: 389px) {
	.parallax { min-height: 300px }
	.smallerparallax { min-height: 200px }
	.caption { font-size: 2em; }
	.caption br{ display:none;}
}
